<!--
**********************************************************
* @Author: 张小平
* @Date:   2024-05-01
* @Email:  qqshuqian@163.com
* @Last modified: 最后修改日期
* @Description: 文件描述
**********************************************************
-->
<template>
  <div class="user">

    <basic-container>
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="待办" name="3"></el-tab-pane>
        <el-tab-pane label="消息" name="1"></el-tab-pane>
        <el-tab-pane label="通知" name="2"></el-tab-pane>
      </el-tabs>
      <div>
        <avue-crud
                v-model="form"
                v-model:page="page"
                v-model:search="searchForm"
                @row-dblclick="handleRowDBLClick"
                :permission="getPermission"
                v-bind="bindVal"
                v-on="onEvent"
                :option="option"
                :data="tableData"
                :before-open="beforeOpen"
        >
        </avue-crud>
      </div>

    </basic-container>
  </div>
</template>

<script>
  import curdMixin from '@/framework-core/mixins/crud';
  import { getNoticePage ,getUnreadNoticeNum,updateMsg} from '@/framework-core/api/login';

  export default {
    name: "usernotice",
    mixins: [curdMixin],
    data() {
      return {
        activeName: '1',
        pageConfig:{"url":"webMessage/tWebsiteMessage"},
        searchForm: {},
        loading: false,
        form:{},
        option: {
          "border": true,
          "index": true,
          "indexLabel": "#",
          "stripe": true,
          "menuAlign": "center",
          grid: window.isMobile,
          gridSpan: 24,
          "align": "center",
          "searchMenuSpan": 6,
          menu: false,
          addBtn: false,
          searchEnter: true,
          "column": [
            {
              "type": "switch",
              "label": "状态",
              "prop": "readstatus",
              "width": "80px",
              dicData: [
                {
                  label: '未读',
                  value: 0
                },{
                  label: '已读',
                  value: 1
                }],
              'search': true,
              "span": 12
            },
            {
              "type": "input",
              "label": "标题",
              "prop": "title",
              'search': true,
              "span": 12
            }
            ,
            {
              "type": "switch",
              "label": "强制提醒",
              "prop": "remind",
              "width": "100px",
              dicData: [
                {
                  label: '否',
                  value: 0
                },{
                  label: '是',
                  value: 1
                }],
              'search': true,
              "span": 12
            },
            {
              "width": "180px",
              label: '发布时间',
              prop: 'createTime',
              type: 'datetime',
              format: 'YYYY-MM-DD HH:mm',
              editDisabled: true,
              addDisplay: false,
              span: 24,
            }
          ]
        },
        imgdatas:[],

      };
    },
    computed: {
      ...mapState({
        permissions: (state) =>state.user.permission,
      })

    },
    created() {
      this.init();
    },
    methods: {
        init() {

        },
        getPermission: function (key, row, index) {
            return true;
        },
        handleClick(tab, event) {
            debugger
            console.log(tab);
          var readstatusEle1 = this.findObject(this.option.column, 'readstatus');
          this.activeName = tab.index*1;
            if(this.activeName ===1){
              readstatusEle1.hide = false;
            }else if(this.activeName ===2){
              readstatusEle1.hide = true;
            }else{
              readstatusEle1.hide = true;
            }
            this.getPage();
        },
        handleRowDBLClick(item, event) {
            if (item.readstatus == 1) {
                return
            }
            if(item.type!=1){
              return
            }
            var $item = item;
            var $that = this;
            updateMsg({"messageId": item.id}).then(() => {
                $item.readstatus = 1;
                $that.getUnReadTotal();
            }).catch(() => {
            });
        },
        getPage() {
            this.loading = true;
            this.tableData = [];
            this.page.total = 0;
            var p = this.buildParam();
            p.entity.type = this.activeName;
            getNoticePage(
                p
            )
                .then(response => {
                    this.tableData = response.data.data.records;
                    this.page.total = response.data.data.total;
                    this.$message.success('获取成功')
                    this.loading = false;
                })
                .catch(() => {
                    this.loading = false;
                });
        },

    }
  };
</script>
<style lang="scss">

</style>
